<template>
  <div class="body">
    <header class="header">
      <div class="title">
        <img src="../../../assets/images/01_11.png" alt="" class="img_zuo" @click="back" />
        <div>巡查排查</div>
        <img class="img_big" src="../../../assets/images/01_05.png" @click="add" />
      </div>
    </header>
    <div class="contant">
     <div @click="btn(item.patrolTroubleshootId)" class="box_list" v-for="(item, index) in datas" :key="index">
        <img class="img_logo5" src="../../../assets/images/logo5.png" />
        <div class="center">
          <div style="width: 70%;">
            <div class="small_title">[{{item.broadHeadingName}}]{{item.unitsName}}</div>
            <div class="introduce">
              <div>{{item.phcName}}</div>
              <div class="intro_name">
                <img src="../../../assets/images/people.png" />
                <div>{{item.ptPerson}}</div>
              </div>
            </div>
          </div>
          <div class="data">{{item.niAddtime}}</div>
        </div>
      </div>
    </div>

    <div class="xz_conter" v-show="show">
      <div @click="scan">扫一扫</div>
      <div @click="jump">新增</div>
    </div>
     <van-tabbar v-model="active" route>
            <van-tabbar-item to="/index" replace>
              <span>主页</span>
              <img
                slot="icon"
                slot-scope="props"
                :src="props.active ? icon.active : icon.inactive"
              >
            </van-tabbar-item>
             <van-tabbar-item to="/message" replace>
              <span>消息</span>
              <img
                slot="icon"
                slot-scope="props"
                :src="props.active ? icon2.active : icon2.inactive"
              >
            </van-tabbar-item>

            <van-tabbar-item to="/me" replace>

              <span>我</span>
              <img
                slot="icon"
                slot-scope="props"
                :src="props.active ? icon4.active: icon4.inactive"
              >
            </van-tabbar-item>
      </van-tabbar>
  </div>
</template>

<script>
// import  Tabbar from '../../tabbar'
  export default {
    name: 'inspection',
    data() {
      return {
        userId: null,//用户id
        shequ_id: null,//社区ID
        datas: null,
        show: false,//显示隐藏增加栏
        active:0,
         icon: {
          active: require('../../../assets/images/tabbar_home_active.png'),
          inactive: require('../../../assets/images/tabbar_home.png')
        },
         icon2: {
          active: require('../../../assets/images/tabbar_msg_active.png'),
          inactive: require('../../../assets/images/tabbar_msg.png')
        },
         icon3: {
          active: require('../../../assets/images/call_active.png'),
          inactive: require('../../../assets/images/call.png')
        },
         icon4: {
          active: require('../../../assets/images/tabbar_user_active.png'),
          inactive: require('../../../assets/images/tabbar_user.png')
        },
      }
    },
    components: {
    // Tabbar
  },
    methods: {
      back() {
        this.$router.push("/index");
      },
      jump(){},//新增
      add() {
        this.show ? this.show = false : this.show = true
      },
      scan() {
        // sessionStorage.removeItem('sessionquji');
        // sessionStorage.removeItem('sessionjiedao');
        // sessionStorage.removeItem('sessionshequ');
        // sessionStorage.removeItem('sessionnumber');
        // sessionStorage.removeItem('sessionchuan');
        // sessionStorage.removeItem('fidname');
        // sessionStorage.removeItem('didname');
        this.$router.push("/xcpc_scan");
      },
      btn(patrolTroubleshootId) {
        sessionStorage.setItem("inspection_patrolTroubleshootId",patrolTroubleshootId)
        this.$router.push("/hard_detail");
      },
      inof() {
        try {
          plus.nativeUI.showWaiting("正在加载...");
        } catch (e) {
          console.log('plus问题');
        }
        this.axios
          .post(
            `${this.$global_msg.Url.host}/SearchScreen/selectSearchScreenByUnitsId?userId=${this.userId}&unitsId=${this.shequ_id}`
          )
          .then(res => {
            console.log(res)
            try {
              plus.nativeUI.closeWaiting();
            } catch (e) {
              console.log('plus问题');
            }
            if (res.data.code == 0) {
              this.datas = res.data.rows.reverse()
            } else {
              this.$toast(res.data.msg);
            }

          }) .catch(error => {
            this.$terminal._error(error)
          });

      },

    },
    mounted() {
      var _this = this;
      // document.body.style.backgroundColor="#F7F7F9";

      //物理返回
      // window.addEventListener("popstate", function(){
      //   _this.back();
      // }, false);
    },
    created() {
      this.userId = localStorage.getItem("userId")//获取访问id
      this.shequ_id = sessionStorage.getItem("jzw_community_list_shequ_id")
      this.inof()

    }
  }
</script>

<style scoped>
  .xz_conter {
    width: 1.8519rem;
    border-radius: 0.1852rem;
    padding: 0 0.1111rem;
    background: #686868;
    position: fixed;
    top: 1.8519rem;
    right: 0.0926rem;
    color: #fff;
    font-size: 0.3889rem;
  }

  .xz_conter>div {
    font-size: 0.3519rem;
    padding: 0.2222rem 0.0926rem;
    border-bottom: 1Px solid #888888;

  }
  .img_logo5 {
    width: 0.8rem;
    margin:0 0.2778rem;
    margin-right: 0.5556rem;
  }

  .data {
    color: #8E8E8E;
  }

  .center {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-right: 0.2778rem;

  }

  .intro_name {
    display: flex;
    align-items: center;
    margin-left: 0.5rem;
  }

  .intro_name img {
    width: 0.4rem;
    margin-right: 0.1852rem;
  }

  .introduce {
    display: flex;
    color: #8E8E8E;
    font-size: 0.3148rem;
    align-items: center;
    margin-top: 0.1852rem;
  }

  .small_title {
    width: 100%;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
  }

  .box_list {
    border-bottom: 1Px solid #f2f2f2;
    display: flex;
    align-items: center;
    height: 1.3889rem;
  }

  .img_big {
    width: 0.629629rem;
    height: 0.629629rem;
  }

  .contant {
    margin-top: 1.8519rem;
    border: 1px solid #F7F7F9;
    padding-bottom: 1.6667rem;
  }

  .header {
    height: 1.8519rem;
    background: #007aff;
    padding-top: 0.8333rem;
    box-sizing: border-box;
    position: fixed;
    width: 100%;
    top: 0;
    z-index: 20;
    font-size: 0.388888rem;
  }

  .title {
    padding: 0 0.3704rem;
    display: flex;
    align-items: center;
    color: #fff;
  }

  .title>div {
    width: 100%;
    font-size: 0.4444rem;
    text-align: center;
  }

  .img_zuo {
    width: 0.2593rem;
    height: 0.463rem;
  }



   .van-tabbar{
    padding:0.4rem 0 ;
}
.van-tabbar--fixed {
  position: fixed;
  bottom: 0;
  left: 0;
  background: #ffffff;
}
.van-tabbar--fixed{
    border-top: 1px solid #cccccc;
    /* border: none; */
    padding-top: 0.8rem;
}
.van-tabbar-item{
    font-size: 0.44rem;
    line-height: 0.6rem;
}
.van-tabbar-item__icon img {
    display: block;
    height: 0.5333rem;
}
[class*=van-hairline]::after{
  border: none;
}
</style>
